import { computed } from 'vue'
import { theme } from 'ant-design-vue'
import { useAppStore } from '@/stores/app'

// 主题颜色常量
export const THEME_COLORS = {
  primary: '#769fcd',
  primaryLight: '#b9d7ea',
  primaryLighter: '#d6e6f2',
  primaryLightest: '#f7fbfc',
  white: '#ffffff',
  borderRadius: 6,
} as const

// 暗色主题颜色常量
export const DARK_THEME_COLORS = {
  primary: '#769fcd',
  primaryLight: '#4a6b8a',
  primaryLighter: '#2d3e50',
  primaryLightest: '#1a1a1a',
  white: '#141414',
  borderRadius: 6,
} as const

// 共享的主题配置
export const useThemeConfig = () => {
  const appStore = useAppStore()

  return computed(() => {
    const isDark = appStore.isDarkMode
    const colors = isDark ? DARK_THEME_COLORS : THEME_COLORS

    return {
      token: {
        colorPrimary: THEME_COLORS.primary, // 主色保持一致
        colorBgBase: colors.primaryLightest,
        colorBgContainer: colors.white,
        colorBgElevated: colors.white,
        colorBgLayout: colors.primaryLightest,
        borderRadius: colors.borderRadius,
        // 暗色主题下的文本颜色调整
        ...(isDark && {
          colorText: 'rgba(255, 255, 255, 0.85)',
          colorTextSecondary: 'rgba(255, 255, 255, 0.65)',
          colorTextTertiary: 'rgba(255, 255, 255, 0.45)',
          colorBorder: 'rgba(255, 255, 255, 0.15)',
          colorBorderSecondary: 'rgba(255, 255, 255, 0.06)',
        })
      },
      algorithm: isDark ? theme.darkAlgorithm : theme.defaultAlgorithm,
    }
  })
}
